<template>
	<div id="UHOD_container">
		<div class="UHID_Items">
			<el-table :data="this.OrderDetailsItems" style="width: 100%" height="600px">
				<el-table-column fixed min-width="1%">
				</el-table-column>
				<el-table-column fixed prop="eId" label="商品编号" min-width="2%">
				</el-table-column>
				<el-table-column label="商品详情" prop="goodsImgUrl" min-width="3%">
					<template slot-scope="scope" v-if="scope.row.goodsImgUrl">
						<!-- <el-button size="mini" @click="findimage(scope.row)">查看</el-button> -->
						<el-image style="width: 100px; height: 50px"
							:src="require('@/assets/equipments/'+scope.row.goodsImgUrl)"
							:preview-src-list="[require('@/assets/equipments/'+scope.row.goodsImgUrl)]" />
					</template>
				</el-table-column>
				<el-table-column prop="goodsName" label="商品名" min-width="3%">
				</el-table-column>

				<el-table-column prop="goodsDescription" label="描述" min-width="5%">
				</el-table-column>
				<el-table-column prop="eCount" label="数量" min-width="5%">
				</el-table-column>
				<el-table-column prop="eRealprice" label="实付金额" min-width="5%">
				</el-table-column>
				<el-table-column prop="ePrice" label="价格" min-width="5%">
				</el-table-column>
			</el-table>
			<div id="UHOD_Info">

			</div>
		</div>
	</div>
</template>

<script>
	import request from '../../../utils/axios/request'
	export default {
		data() {
			return {
				ODId: [],
				OrderDetailsItems: [{
					orderDetailsId: '',
					eId: '',
					eCount: '',
					eRealprice: '',
					ePrice: '',
					goodsName: '',
					goodsDescription: '',
					goodsImgUrl: ''
				}],

			}
		},

		// created() {
		// 	// console.log('this.$route.query.data')
		// 	// console.log(this.$route.query.data)
		// 	this.ODId = this.$route.query.data.split(',')
		// 	// console.log(this.ODId)
		// 	// console.log('this.ODId')
		// 	let jsonObj = JSON.stringify(this.ODId)
		// 	// console.log('jsonObj')
		// 	// console.log(jsonObj)
		// 	var id = [];
		// 	this.ODId.forEach((item) => {
		// 		id.push(item);
		// 	})
		// 	// console.log('id')
		// 	// console.log(id)
		// 	request({
		// 		method: 'post',
		// 		url: '/ordersDetails/find',
		// 		data: id
		// 	}).then((res) => {
		// 		this.OrderDetailsItems = res.data.data
		// 		// console.log('res')
		// 		console.log(res)
		// 		// console.log('res')
		// 		var eid = [];
		// 		res.data.data.forEach((item) => {
		// 			eid.push(item.eId);
		// 		})
		// 		console.log(eid)
		// 		request({
		// 			method: 'post',
		// 			url: '/equipments/equipmentsLists',
		// 			data: eid
		// 		}).then((res2) => {
		// 			console.log('res2')
		// 			console.log(res2)
		// 			console.log('res2')
		// 			var jsonObj = JSON.parse(JSON.stringify(res2.data.data));
		// 			// console.log(jsonObj)
		// 			// console.log('阿八八八')
		// 			for (var i = 0; i < jsonObj.length; i++) {
		// 				this.OrderDetailsItems[i].goodsName = jsonObj[i].eName;
		// 				this.OrderDetailsItems[i].goodsDescription = jsonObj[i].eDescription;
		// 				this.OrderDetailsItems[i].goodsImgUrl = jsonObj[i].imageUrl;
		// 			}
		// 			console.log('this.OrderDetailsItems')
		// 			console.log(this.OrderDetailsItems)
		// 			console.log('this.OrderDetailsItems')
		// 		})

		// 	})
		// },
		created() {
			// console.log('this.$route.query.data')
			// console.log(this.$route.query.data)
			this.$options.methods.getOrdersDetails()
			// console.log('asdfas')
			let getOrdersDetails = JSON.parse(sessionStorage.getItem('OrderDetailsItems'))
			// console.log(this.$options.methods.getOrdersDetails())
			// console.log(sessionStorage.getItem('OrderDetailsItems'))
			this.OrderDetailsItems = getOrdersDetails
			// console.log(getOrdersDetails)
			// console.log('asdfas')
			// console.log('this.OrderDetailsItems')
			// console.log(this.OrderDetailsItems)
			// console.log('this.OrderDetailsItems')
		},
		methods: {
			getOrdersDetails() {
				let Odid = sessionStorage.getItem('odid')
				var a = [];
				a = Odid.split(',')
				// console.log(this.ODId)
				console.log('this.a')
				let jsonObj = JSON.stringify(this.a)
				// console.log('jsonObj')
				// console.log(jsonObj)
				var id = [];
				a.forEach((item) => {
					id.push(item);
				})
				// console.log('id')
				// console.log(id)
				request({
					method: 'post',
					url: '/ordersDetails/find',
					data: id
				}).then((res) => {
					// console.log('res')

					let ODItems = res.data.data
					// console.log('res')
					// console.log(res)
					var eid = [];
					res.data.data.forEach((item) => {
						eid.push(item.eId);
					})
					request({
						method: 'post',
						url: '/equipments/equipmentsLists',
						data: eid
					}).then((res2) => {
						// console.log('res2')
						// console.log(res2)
						// console.log('res2')
						var jsonObj = JSON.parse(JSON.stringify(res2.data.data));
						// console.log(jsonObj)
						// console.log('阿八八八')
						for (var i = 0; i < jsonObj.length; i++) {
							ODItems[i].goodsName = jsonObj[i].eName;
							ODItems[i].goodsDescription = jsonObj[i].eDescription;
							ODItems[i].goodsImgUrl = jsonObj[i].imageUrl;
						}
						// console.log('ODItems')
						// console.log(ODItems)
						// console.log('ODItems')
						sessionStorage.setItem('OrderDetailsItems', JSON.stringify(ODItems))			
					})
				})
			}
		}

	}
</script>

<style scoped>
	#UHOD_Info {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		background-color: #ff5500;
	}

	.UHID_Items {
		width: 100%;
		height: auto;
		background-color: #55ffff;
	}

	#UHOD_container {
		width: 100%;
		height: auto;
		overflow-y: hidden;
		overflow-x: hidden;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		background-color: #f4f4f4;
	}
</style>